<template>
  <div

    style="height: 523px; overflow: hidden; background: white; border:1px solid white ; border-radius: 8px; margin-top: 10px;">

    <div style="padding: 14px;">
      <h5 style="text-align: left; margin-left: -3px;"> 当前等待登记的生产派工单总数：{{this.tableData.length}} 例</h5>
    </div>
    <div style="background-color: #E9EEF3; height: 450px; margin: 10px; padding: 4px; border-radius: 7px;">
      <template>
        <el-table :data="tableData" style="width: 100%;height: 400px;">
          <el-table-column prop="scpgd_id" label="生产派工单编号" width="212">
          </el-table-column>
          <el-table-column prop="proSige_id" label="产品编号" width="100">
          </el-table-column>

          <el-table-column prop="pName" label="产品名称" width="100">
          </el-table-column>
          <el-table-column prop="num" label="数量" width="100">
          </el-table-column>
          <el-table-column prop="arrayOutList" label="出库单编号集合" width="190">
          </el-table-column>
          <el-table-column prop="regTime" label="登记时间" width="160">
          </el-table-column>
          <el-table-column label="审核" show-overflow-tooltip>
            <template slot-scope="scope">
              <el-button type="primary" size="mini" @click="zhisjd(scope.row)" round="">审核</el-button>
            </template>
          </el-table-column>

        </el-table>
      </template>
      <div class="block" style="margin-top: 15px;">
        <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="pageNum"
          :page-sizes="[1,2,7]" :page-size="pageSize" layout="total, sizes, prev, pager, next, jumper" :total="total">
        </el-pagination>
      </div>
    </div>
    <el-dialog title="工序物料设计单" :visible.sync="dialogVisible" width="62%" height="300px" :before-close="handleClose">
      <p style="margin-left: 532px;margin-bottom: 20px;">
      </p>
      <el-form :model="proDisOrder">
        <el-row>
          <el-col :span="16">
            <h5 style="text-align: left; ">派工单编号:{{ this.proDisOrder.scpgd_id}}</h5>
          </el-col>
        </el-row>
        <el-row style="margin-top: 6px;">
          <el-col :span="16">
            <h5 style="text-align: left; ">产品名称:{{this.proDisOrder.pName}}</h5>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="16">
            <h5 style="text-align: left;margin-top: 6px">产品编号:{{this.proDisOrder.proSige_id}}</h5>
          </el-col>
        </el-row>
        <el-row style="margin-top: 6px;">
          <el-col :span="16">
            <h5 style="text-align: left; ">数量:{{this.proDisOrder.num}}</h5>
          </el-col>
          <el-col :span="8">
            <h5>工单制定人
              <input v-model="proDisOrder.woderMaker" class="input_01" />
            </h5>
          </el-col>

        </el-row>

        <el-table border ref="multipleTable" :data="tableData1" tooltip-effect="dark"
          style="width: 100%;margin-top: 25px;" @selection-change="handleSelectionChange" size="mini">
          <el-table-column prop="pucess_gid" label="序号" width="60">
          </el-table-column>
          <el-table-column prop="processesName" label="工序名称" width="80">
          </el-table-column>
          <el-table-column prop="processesid" label="工序编号" width="80">
          </el-table-column>
          <el-table-column prop="processesDes" label="描述" width="100">
          </el-table-column>
          <el-table-column prop="gongShiNum" label="工时数(小时)" width="95">
          </el-table-column>
          <el-table-column prop="gScount" label="工时成本小计(元)" width="120">
          </el-table-column>
          <el-table-column prop="wlcount" label="物料成本小计(元)" width="120">
          </el-table-column>
          <el-table-column label="审核物料" width="86">
            <template slot-scope="scope">
              <el-button type="primary" @click="ProWuSheji(scope.row)" size="mini" style="width: 60px; height: 30px;"
                round>审核</el-button>
            </template>
          </el-table-column>
        </el-table>


        <el-row style="margin-top: 25px;">
          <el-col :span="16">
            <h5 style="text-align: left;">工时总成本:{{this.proDisOrder.gongShiPrice}}</h5>
          </el-col>
          <el-col :span="8">
            <h5 style="text-align: right;">物料总成本:{{this.proDisOrder.wuliaoSumPrice}}</h5>
          </el-col>
        </el-row>
        <el-row style="margin-top: 15px;">
          <el-col :span="16">
            <h5 style="text-align: left;">登记人:<input v-model="proDisOrder.registrant" class="input_01" /></h5>
          </el-col>
          <el-col :span="8">
            <h5 style="text-align: right;">登记时间 : {{this.proDisOrder.regTime}}</h5>
          </el-col>
        </el-row>
        <el-row style="margin-top: 15px;">
          <el-col :span="16">
            <h5 style="text-align: left;">审核人:
              <input v-model="proDisOrder.thereviewer" class="input_01" />
            </h5>
          </el-col>
          <el-col :span="8">
            <h5 style="text-align: right;">审核时间 : {{this.proDisOrder.audittime}}</h5>
          </el-col>
        </el-row>
        <el-row style="margin-top: 15px;">
          <el-col :span="8">
            <h5 style="text-align: left;">出库单编号 :{{this.proDisOrder.arrayOutList}}</h5>
          </el-col>
        </el-row>
        <el-row style="margin-top: 15px;text-align: left;">
          <el-col :span="16">
            <h4>备注:</h4>
          </el-col>
          <el-col :span="24" style="margin-top: 10px;">
            <textarea  style="margin: 0px; height: 65px; width: 747px;" v-model="proDisOrder.remark"></textarea>
          </el-col>
        </el-row>
      </el-form>
      <span slot="footer">
        <el-button style="width: 45px ; height: 25px;" @click="canle()">关 闭</el-button>
        <el-button style="width: 75px ; height: 25px;" type="primary" @click="closeClick()">未通过</el-button>
        <el-button style="width: 75px ; height: 25px;" type="primary" @click="openClick()">通过</el-button>
      </span>
    </el-dialog>




    <el-dialog title="工序物料组成设计单" :visible.sync="dialogVisible2" width="62%" height="300px" :before-close="handleClose">
      <el-row>
        <el-col :span="16">
          <h5 style="text-align: left; ">设计单编号:{{ this.proDisOrder.scpgd_id}}</h5>
        </el-col>
        <el-col :span="8">
          <h5 style="text-align: right; ">工序名称:{{ this.processesName}}</h5>
        </el-col>
      </el-row>
      <el-table border ref="multipleTable2" :data="tableData2" tooltip-effect="dark"
        style="width: 100%;margin-top: 15px;" size="mini">
        <el-table-column type="index" :index="1" width="100">
        </el-table-column>
        <el-table-column prop="pName" label="物料名称" width="100">
        </el-table-column>
        <el-table-column prop="wid" label="物料编号" width="100">
        </el-table-column>
        <el-table-column prop="processesNum" label="本工序数量" width="100">
        </el-table-column>
        <el-table-column prop="price" label="单价(元)" width="90">
        </el-table-column>
        <el-table-column prop="count" label="小计" show-overflow-tooltip>
        </el-table-column>
      </el-table>
      <span slot="footer">
        <el-button style="width:  80px ; height: 25px;" type="primary" @click="qdgx()">关闭</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
  export default {
    name: 'repset',
    data() {
      return {
        processesName: '',
        o: 0,
        pageNum: 1,
        pageSize: 7,
        total: 0,
        tableData: [],
        tableData1: [],
        tableData2: [],
        name: '',
        proDisOrder: {
          scpgd_id: 0,
          newpro_id: 0,
          woderMaker: '', // 工单制定人
          arrayOutList: '', //出库单编号集合
          proSige_id: '', //产品id
          pName: '', //产品名称
          sumPrice: '', //生产单价
          num: '', //数量
          remark: '', //备注,
          regTime: '', //登记时间
          registrant: '', //登记人
          gongShiPrice: '', //工时总成本
          thereviewer: '', //审核人
          audittime: '', //审核时间
          wuliaoSumPrice: 0
        },
        dialogVisible: false,
        dialogVisible2: false,
        multipleSelection: [],
        mpsDto: {
          proproSheet: {},
          dproList: [],
          materialList: []
        },
        new_proproSheet: {},
        proproSheet: {
          pducess_id: '', //设计编号
          proSige_id: '', //产品编号
          regtime: '',
          designer: '', //设计人
          redner: '',
          designreq: '',
          pName: '', //产品名称
          gongShiPrice: '', //工时总成本
          thereviewer: '', //审核人
          audittime: this.timer, //审核时间
          wuliaoSumPrice: 0 //物料总成本
        },
        MaterialList: {
          id: '',
          pducess_id: '', //设计单id
          proSige_id: '', //产品档案
          processesid: '', //工序项目编号
          wid: '', //物料id
          wuprice: '', //单价
          wunum: '', //数量
          count: '' //小计
        },
        formLabelWidth: '120px'
      }
    },
    methods: {
      closeClick() {
         this.$confirm('否决该生产计划?', '提示', {
           confirmButtonText: '已核对',
           cancelButtonText: '取消',
           type: 'info'
         }).then(() => {
           var data = this.proproSheet;
           var newData = new URLSearchParams();
           this.$http.post('production/product/delPdo?scpgd_id='+this.proDisOrder.scpgd_id).then(res => {
             if (res.status === 200) {
               this.$message({
                 type: 'success',
                 message: '完成!',
               });
               this.GetOnline(this.pageNum, this.pageSize);
               this.dialogVisible2 = false;
               this.dialogVisible = false;
             }
           }).catch(err => {
             config.log(err)
           })
         }).catch(() => {
           this.$message({
             type: 'info',
             message: '已取消审核'
           });
         })
      },
      tableRowClassName({
        row,
        rowIndex
      }) {
        if (rowIndex === 1) {
          return 'warning-row';
        } else if (rowIndex === 3) {
          return 'success-row';
        }
        return '';
      },
      handleSizeChange(val) {
        this.pageSize = val;
        this.GetOnline(this.pageNum, this.pageSize);
      },
      handleCurrentChange(val) {
        this.pageNum = val;
        this.GetOnline(this.pageNum, this.pageSize);
      },
      handleClose(done) {
        this.$confirm('确认关闭？')
          .then(_ => {
            done();
          })
          .catch(_ => {});
      },
      toggleSelection(rows) {
        if (rows) {
          rows.forEach(row => {
            this.$refs.multipleTable.toggleRowSelection(row);
          });
        } else {
          this.$refs.multipleTable.clearSelection();
          this.$refs.multipleTable2.clearSelection();
          this.multipleSelection = [];

        }
      },
      handleSelectionChange(val) {
        this.multipleSelection = [];
        for (var i = 0; i < val.length; i++) {
          this.multipleSelection.push(val[i].id)
        }
        console.log(this.multipleSelection);

      },
      GetOnline(pageNum, pageSize) {
        var data = new URLSearchParams();
        data.append("pageNum", pageNum);
        data.append("pageSize", pageSize);
        this.$http.post('production/product/scjhshfindByPager', data).then(res => {
          console.log(res.data);
          this.pageNum = res.data.pageNum;
          this.pageSize = res.data.pageSize;
          this.total = res.data.total;
          this.tableData = res.data.rows;
        }).catch(err => {
          console.log(err);
        })
      },
      zhisjd(data) {
        this.proDisOrder.woderMaker = data.woderMaker;
        this.proDisOrder.remark = data.remark;
        this.proDisOrder.scpgd_id = data.scpgd_id;
        this.proDisOrder.wuliaoSumPrice = data.wuliaoSumPrice;
        this.proDisOrder.gongShiPrice = data.gongShiPrice;
        this.proDisOrder.pName = data.pName;
        this.proDisOrder.proSige_id = data.proSige_id
        this.proDisOrder.num = data.num;
        this.proDisOrder.regTime = data.regTime
        this.proDisOrder.audittime = this.getNewDate();
        this.proDisOrder.registrant = data.registrant;
        var datas = new URLSearchParams();
        datas.append('scpgd_id', data.scpgd_id);
        this.$http.post('production/product/selPdoProcess', datas).then(res => {
          if (res.status == 200) {
            this.tableData1 = res.data;
          }
        }).catch(err => {
          console.log(err);
        })
        this.dialogVisible = true;
      },
      ProWuSheji(data) {
        this.processesName = data.processesName;
        var index = this.tableData1.findIndex(i => {
          if (data.processesid == i.processesid) {
            return true;
          }
        })
        this.tableData2 = this.tableData1[index].pdoProcessWuLiaos;


        this.dialogVisible = false;
        this.dialogVisible2 = true;
      },
      qdgx() {
        this.dialogVisible2 = false;
        this.dialogVisible = true;
      },
      updateprocessWucount(data) {
        this.$http.post('production/product/updateProcessWucount', this.$qs.stringify(data)).then(res => {
          if (res.status == 200) {
            conlog.log('工序价格小计价格更新成功结果');
          }
        }).catch(err => {
          console.log(err);
        })
      },
      getWunum(data) {
        if (data.wunum > data.keyongNum) {
          console.log('已经超过可用数量,请重新设置!');
          var index = this.tableData2.findIndex(i => {
            if (data.pName == i.pName) {
              return true;
            }
          })
          this.tableData2[index].wunum = 0;
        }
      },
      flushtabledata1(pducess_id, proSige_id) {
        var data = new URLSearchParams();
        data.append('pducess_id', pducess_id);
        data.append('proSige_id', proSige_id);
        this.$http.post('production/product/makeProcessSh', data).then(res => {
          if (res.status == 200) {
            this.tableData1 = res.data;
          }
        }).catch(err => {
          console.log(err);
        })
      },
      open(data) {
        this.$confirm('重新设计将首先清除原有本工序物料的设计，您确认进行重新设计吗？', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          var newData = new URLSearchParams();
          newData.append("proSige_id", data.proSige_id);
          newData.append("pducess_id", data.pducess_id);
          newData.append("processesid", data.processesid);
          console.log(data.processesid);
          this.$http.post('production/productionproduct/repalceWuliao', newData).then(res => {
            if (res.status === 200) {
              this.$message({
                type: 'success',
                message: '重置成功!',
              });
              var index = this.tableData1.findIndex(i => {
                if (data.processesName == i.processesName) {
                  return true;
                }
              })
              this.proproSheet.wuliaoSumPrice = this.proproSheet.wuliaoSumPrice - this.tableData1[index].wugCount;
              this.flushtabledata1(data.pducess_id, data.proSige_id);
            }
          }).catch(err => {

          })
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消删除'
          });
        });
      },
      openClick() {
        this.$confirm('确定核对该是生产派工单?', '提示', {
          confirmButtonText: '已核对',
          cancelButtonText: '取消',
          type: 'info'
        }).then(() => {
          var data = this.proproSheet;
          var newData = new URLSearchParams();
          this.$http.post('production/product/okshpgd',this.$qs.stringify(this.proDisOrder)).then(res => {
            if (res.status === 200) {
              this.$message({
                type: 'success',
                message: '审核完成!',
              });
              this.GetOnline(this.pageNum, this.pageSize);
              this.dialogVisible2 = false;
              this.dialogVisible = false;
            }
          }).catch(err => {
            config.log(err)
          })
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消审核'
          });
        })
      },
      canle() {
        this.proproSheet.audittime = this.timer;
        this.dialogVisible = false
      },
      getNewDate() {
        var date = new Date();
        console.log(date);
        var transverse = "-";
        var Verticalpoint = ":";
        var month = date.getMonth() + 1; //获取月份
        var strDate = date.getDate(); //获取具体的日期
        var strHour = date.getHours(); //获取...钟点
        var strMinute = date.getMinutes(); //获取分钟数
        var strSeconde = date.getSeconds(); //获取秒钟数
        //判断获取月份 、 具体的日期 、...钟点、分钟数、秒钟数 是否在1~9
        //如果是则在前面加“0”
        if (month >= 1 && month <= 9) {
          month = "0" + month;
        }
        console.log(month);
        if (strDate >= 1 && strDate <= 9) {
          strDate = "0" + strDate;
        }
        if (strHour >= 1 && strHour <= 9) {
          strHour = "0" + strHour
        }
        console.log(strHour);
        if (strMinute >= 1 && strMinute <= 9) {
          strMinute = "0" + strMinute;
        }

        if (strSeconde >= 1 && strSeconde <= 9) {
          strSeconde = "0" + strSeconde;
        }
        //时间日期字符串拼接
        var NewDate = date.getFullYear() + transverse + month + transverse + strDate + " " +
          strHour + Verticalpoint + strMinute + Verticalpoint + strSeconde;
        //返回拼接字符串
        return NewDate;
      }

    },
    mounted() {
      this.GetOnline(this.pageNum, this.pageSize);
    }
  }
</script>

<style scoped="scoped">
  .el-input--mini .el-input__inner {
    height: 20px;
    line-height: 28px;
  }

  * {
    padding: 0px;
    margin: 0px;
  }

  .boder_one {
    border-top: none;
    border-left: none;
    border-right: none;
    width: 105px;
  }

  th {
    background-color: blue;
  }

  .el-table tr {
    background-color: royalblue;
  }

  .el-breadcrumb__inner {
    color: black;

  }

  .el-input__inner {

    height: 25px;

  }

  .el-input__prefix,
  .el-input__suffix {
    position: absolute;
    top: 7px;
    -webkit-transition: all .3s;
    height: 100%;
    color: #C0C4CC;
    text-align: center;
  }

  .el-table td {
    padding: 10px 0;
  }

  #father {
    height: 480px;
    overflow: hidden;
    background: white;
    border: 1px solid white;
    border-radius: 12px;

  }

  #sons {
    /* margin: 9px auto; */

    width: 100%;
    padding: 0px;
    background-color: white;
    margin-top: 15px;
    /* border: 3px solid whitesmoke; */
    /* border-radius: 16px; */

  }

  #son {

    padding: 15px;
    width: 100%;
    background-color: white;

  }

  .input_01 {
    border-top: none;
    border-right: none;
    border-left: none;
  }
</style>
